<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>物业管理系统物业端</title>
    <link rel="stylesheet" href="./static/css/common.css">
    <link rel="stylesheet" href="./static/css/index.css">
    <script src="./js/index.js"></script>
    <script src="./js/axios.min.js"></script>
    <script src="./js/vue.min.js"></script>
    
    
</head>

<body>
    
    <div id="app">
        <!--左侧菜单-->
        <div class="menu_container">
            <div class="log flex_center"> 物业管理系统</div>
            <div class="menu">
                <ul>
                    <li @click="homeShow(0)" id="list0">用户管理</li>
                    <li @click="freightManagementShow(1)" id="list1">费率管理</li>
                    <li @click="statiticsShow(2)" id="list2">楼栋管理</li>
                    <li @click="salaryShow(3)" id="list3">欠费查询</li>
                    <li @click="managerShow(4)" id="list4">房间管理</li>
                    <li @click="paiedShow(5)" id="list5">支付记录</li>
                </ul>
            </div>
        </div>
        <div class="right_container">
            <!--顶部-->
            <div class="right_top">
            </div>
            <!--用户管理-->
            <div class="home" v-show="home">
                <h2>用户管理</h2>
                <div class="staffTop">
                    <div>用户管理</div>
                    <div class="operation">
                        <span>
                            <button @click="deptAddShow">新增</button>
                            <!-- <button>批量删除</button> -->
                        </span>
                        <!-- <input class="serach_input" type="text" name="" id="" placeholder="请输入员工姓名、工号、或部门"> -->
                    </div>
                </div>
                <div class="staff_div">
                    <ul class="box_shadow">
                        <!-- <li class="checkbox_li"><input class="size_20" type="checkbox"></li> -->
                        <li>序号</li>
                        <li class="name_li">用户名</li>
                        <li class="workNum_li">账户</li>
                        <li class="dept_li">性别</li>
                        <li class="phone_li">年龄</li>
                        <li class="email_li">用户状态</li>
                        <!-- <li class="edu_li">房间号</li>
                        <li class="edu_li">房间面积</li> -->
                        <li class="operation_li">操作</li>
                    </ul>
                    <ul class="dept_ul" v-for="(user,i) in userPage.list" :key="user.userid">
                        <!-- <li class="checkbox_li"><input class="size_20" type="checkbox"></li> -->
                        <li>{{i+1}}</li>

                        <li class="name_li">{{user.username}}</li>
                        <li class="workNum_li">{{user.account}}</li>
                        <li class="dept_li">
                            <span v-if="user.gender == 1">男</span>
                            <span v-if="user.gender == 0">女</span>
                        </li>
                        <li class="phone_li">{{user.age}}</li>
                        <li class="email_li" @click="popupChangeUserStatus(user.userid,user.user_status)">
                            <span v-if="user.user_status == 31">常住业主</span>
                            <span v-if="user.user_status == 32">租户</span>
                            <span v-if="user.user_status == 33">未激活</span>
                        </li>
                        
                        <li class="operation_li" @click="userDetailBtn(user.userid)">
                            <a href="javascript:void(0);">详细信息</a>
                        </li>
                    </ul>
                    <!--分页信息-->
                    <div class="page_info">
                        <ul>
                            <!--首页传递1个参数 1控制请求1用户2楼栋3房间-->
                            <li class="widt-50" @click="startPage(1)">首页</li>
                            <!--上一页1个参数  1控制请求1用户2楼栋3房间-->
                            <li @click="prevPage(1)">&lt;</li>
                            
                            <li @click="userList(userControlPageNum )">{{userControlPageNum}}</li>
                            <!--下一页 1控制请求1用户2楼栋3房间4欠费-->
                            <li @click="nextPage(1)">&gt;</li>
                            <!--尾页传递3个参数 1总页数，2每页多少行，,3控制请求1用户2楼栋3房间-->
                            <li class="widt-50" @click="endPage(userPage.total,userPage.pageSize,1)">尾页</li>
                        </ul>
                    </div>
                </div>
            </div>
            <!--费率管理-->
            <div class="staffManagement" v-show="freightManagement">
                <div class="staffTop">
                    <div>费率管理</div>
                    <!-- <div class="operation">
                        <span>
                            <button @click="deptAddShow">新增</button>
                            <button>批量删除</button>
                        </span>
                        <input class="serach_input" type="text" name="" id="" placeholder="请输入员工姓名、工号、或部门">
                    </div> -->
                </div>
                <div class="staff_div">
                    <ul class="box_shadow">
                        <!-- <li class="checkbox_li"><input class="size_20" type="checkbox"></li> -->
                        <li>序号</li>
                        <li class="name_li">费用名</li>
                        <li class="workNum_li">单价</li>
                        <li class="intro_li">说明</li>
                        <li class="operation_li">操作</li>
                    </ul>
                  
                    <ul class="dept_ul" v-for="(r,i) in rate" :key="r.freight_basis_id" >
                        <!-- <li class="checkbox_li"><input class="size_20" type="checkbox"></li> -->
                        <li>{{i+1}}</li>
                        <li class="name_li">{{r.basis_name}}</li>
                        <li class="workNum_li">{{r.price/100}}</li>
                        <li class="intro_li">{{r.intro}}</li>
                        
                        <li class="operation_li" @click="updateFee(r.freight_basis_id)">
                            <a href="javascript:void(0);">修改</a>
                        </li>
                    </ul>
                   
                    
                </div>
            </div>
            <!--支付记录-->
            <div class="staffManagement" v-show="paied">
                <div class="staffTop">
                    <div>支付记录</div>
                    <div class="operation">
                        <!-- <span>
                            <button @click="deptAddShow">新增</button>
                            <button>批量删除</button>
                        </span> -->
                        <select v-model="building" @click="fillBuildings" style="width: 150px;">
                            <option disabled value="">请选择楼栋号</option>
                            <option v-for="b in buildings" :value="b.building_id">
                                {{b.building_name}}
                            </option>
                        </select>
                        <select v-model="floor" @click="fillFloors">
                            <option disabled value="">请选择楼层号</option>
                            <option v-for="f in floors" :value="f.floor_id">
                                {{f.floor_number}}
                            </option>
                        </select>
                        <input class="serach_input" type="date" name="" id="" v-model="startDate" placeholder="开始日期">
                        <input class="serach_input" type="date" name="" id="" v-model="endDate" placeholder="结束日期">
                        <input class="serach_input" type="text" name="" id="" v-model="pay_username" placeholder="用户名">
                        <input class="serach_input" type="text" name="" id="" v-model="pay_idCard" placeholder="身份证">
                        <button @click="paiedListQuery(1)">查询</button>
                        <!-- <input class="serach_input" type="text" name="" id="" placeholder="请输入员工姓名、工号、或部门"> -->
                    </div>
                </div>
                <div class="staff_div">
                    <ul class="box_shadow">
                        <!-- <li class="checkbox_li"><input class="size_20" type="checkbox"></li> -->
                        <li>序号</li>
                        <li class="workNum_li">楼栋名</li>
                        <li class="workNum_li">房间号</li>
                        <li class="workNum_li">金额</li>
                        <li class="workNum_li">支付日期</li>
                        <li class="workNum_li">类型</li>
                        <!-- <li class="operation_li">操作</li> -->
                    </ul>
                  
                    <ul class="dept_ul" v-for="(p,i) in payPage.list" :key="p.pay.pay_id" >
                        <!-- <li class="checkbox_li"><input class="size_20" type="checkbox"></li> -->
                        <li>{{i+1}}</li>
                        <li class="workNum_li">{{p.building.building_name}}</li>
                        <li class="workNum_li">{{p.room.room_code}}</li>
                        <li class="workNum_li">{{p.pay.pay}}</li>
                        <li class="workNum_li">{{p.pay.pay_date | dateTimeFormat}}</li>
                        <li class="workNum_li" v-if="p.pay.pay_type == 1">水费</li>
                        <li class="workNum_li" v-if="p.pay.pay_type == 2">电费</li>
                        <li class="workNum_li" v-if="p.pay.pay_type == 3">物业费</li>
                        
                        <!-- <li class="operation_li" @click="updateFee(r.freight_basis_id)">
                            <a href="javascript:void(0);">修改</a>
                        </li> -->
                    </ul>
                   
                    <div class="page_info">
                        <ul>
                            <!--首页传递1个参数 1控制请求1用户2楼栋3房间5支付-->
                            <li class="widt-50" @click="startPage(5)">首页</li>
                            <!--上一页1个参数  1控制请求1用户2楼栋3房间-->
                            <li @click="prevPage(5)">&lt;</li>
                            
                            <li @click="buildingListQuery(payControlPageNum )">{{payControlPageNum}}</li>
                            <!--下一页 1控制请求1用户2楼栋3房间-->
                            <li @click="nextPage(5)">&gt;</li>
                            <!--尾页传递3个参数 1总页数，2每页多少行，,3控制请求1用户2楼栋3房间-->
                            <li class="widt-50" @click="endPage(payPage.total,payPage.pageSize,5)">尾页</li>
                        </ul>
                    </div>
                    
                </div>
            </div>
            <!--楼栋管理-->
            <div class="statistics" v-show="statistics">
                <div class="staffTop">
                    <div>楼栋管理</div>
                    <div class="operation">
                        <span>
                            <button @click="insertSinglePop = true">新增</button>
                            <button @click="addBuildingsPop = true">批量添加</button>
                            <button @click="openBacthchangeBuildingStatusPop">批量修改状态</button>
                        </span>
                        <!-- <input class="serach_input" type="text" name="" id="" placeholder="请输入员工姓名、工号、或部门"> -->
                    </div>
                </div>
                <div class="staff_div">
                    <ul class="box_shadow">
                        <li class="checkbox_li"><input class="size_20" type="checkbox" @click='selectAll("buildingAll",2)' id="buildingAll"></li>
                        <li class="name_li">序号</li>
                        <li class="intro_li">楼栋名</li>
                        <li class="count_li">楼层数</li>
                        <li class="count_li">建成时间</li>
                        <li class="count_li">设计年限</li>
                        <li class="count_li">产权年限</li>
                        <li class="count_li">状态</li>
                        <!-- <li class="operation_li">操作</li> -->
                    </ul>
                    <ul class="builing_ul" v-for="(b,i) in buildingPage.list" :key="b.building_id">
                        <li class="checkbox_li"><input class="size_20" :value="b.building_id" @click="checkBoxClick($event.target,b.building_id,2)" type="checkbox"></li>
                        <li class="name_li">{{i+1}}</li>
                        <li class="intro_li">{{b.building_name}}</li>
                        <li class="count_li">{{b.building_floors}}</li>
                        <li class="count_li">{{b.completed_date}}</li>
                        <li class="count_li">{{b.design_life}}</li>
                        <li class="count_li">{{b.ownership}}</li>
                        <li class="count_li" v-if="b.building_status == 1">使用</li>
                        <li class="count_li" v-if="b.building_status == 2">未使用</li>
                        <!-- <li class="operation_li">
                            <a href="#">编辑</a>
                            <a href="#">删除</a>
                        </li> -->
                    </ul>

                    <div class="page_info">
                        <ul>
                            <!--首页传递1个参数 1控制请求1用户2楼栋3房间-->
                            <li class="widt-50" @click="startPage(2)">首页</li>
                            <!--上一页1个参数  1控制请求1用户2楼栋3房间-->
                            <li @click="prevPage(2)">&lt;</li>
                            
                            <li @click="buildingListQuery(buildingControlPageNum )">{{buildingControlPageNum}}</li>
                            <!--下一页 1控制请求1用户2楼栋3房间-->
                            <li @click="nextPage(2)">&gt;</li>
                            <!--尾页传递3个参数 1总页数，2每页多少行，,3控制请求1用户2楼栋3房间-->
                            <li class="widt-50" @click="endPage(buildingPage.total,buildingPage.pageSize,2)">尾页</li>
                        </ul>
                    </div>
                </div>
            </div>
            <!--欠费信息-->
            <div class="salary" v-show="salary">
                <div class="staffTop">
                    <div>欠费信息</div>
                    <div class="operation">
                        <span>
                            <span>费用类型</span>
                            <select name="" id="" v-model="unPaiedType" @change="unPaiedQuery()">
                                <option value="1">水费</option>
                                <option value="2">电费</option>
                                <option value="3">物业费</option>
                            </select>
                            <!-- <select>
                                <option value="">1月</option>
                            </select> -->
                        </span>
                        <!-- <input class="serach_input" type="text" name="" id="" placeholder="请输入员工姓名、工号、或部门"> -->
                    </div>
                </div>
                <div class="staff_div">
                    <ul class="box_shadow">

                        <li class="dept_li">序号</li>
                        <li class="dept_li">用户名</li>
                        <li class="name_li">房间号</li>
                        <li class="count_li">欠费金额</li>
                        <li class="count_li">欠费时间</li>
                        
                        <!-- <li class="operation_li">操作</li> -->
                    </ul>
                    <ul v-for="(u,i) in unPaiedPage.list" :key="u.user.userid">
                        <li class="dept_li">{{i+1}}</li>
                        <li class="dept_li">{{u.user.username}}</li>
                        <li class="name_li">{{u.room.room_code}}</li>
                        <li class="count_li">{{u.amount.amount/100}}</li>
                        <li class="count_li">{{u.amount.amount_date | dateTimeFormat}}</li>
                        
                        <!-- <li class="operation_li">
                            <a href="#">编辑</a>

                        </li> -->
                    </ul>

                    <div class="page_info">
                        <ul>
                            <!--首页传递1个参数 1控制请求1用户2楼栋3房间4欠费信息-->
                            <li class="widt-50" @click="startPage(4)">首页</li>
                            <!--上一页1个参数  1控制请求1用户2楼栋3房间-->
                            <li @click="prevPage(4)">&lt;</li>
                            
                            <li @click="buildingListQuery(unPaiedControlPageNum )">{{unPaiedControlPageNum}}</li>
                            <!--下一页 1控制请求1用户2楼栋3房间-->
                            <li @click="nextPage(4)">&gt;</li>
                            <!--尾页传递3个参数 1总页数，2每页多少行，,3控制请求1用户2楼栋3房间-->
                            <li class="widt-50" @click="endPage(unPaiedPage.total,unPaiedPage.pageSize,4)">尾页</li>
                        </ul>
                    </div>
                </div>
            </div>
            <!--房间管理-->
            <div class="manager" v-show="manager">
                <div class="staffTop">
                    <div>房间管理</div>
                    <div class="operation">
                        <span>
                            <!-- <button @click.prevent="adminAddShow">新增</button> -->
                            <button @click.prevent="batchChangeRoomStatusPop">批量修改状态</button>
                        </span>
                        <!-- <input class="serach_input" type="text" name="" id="" placeholder="请输入员工姓名、工号、或部门"> -->
                    </div>
                </div>
                <div class="staff_div">
                    <ul class="box_shadow">
                        <li class="checkbox_li"><input class="size_20" type="checkbox" id="roomAll" @click='selectAll("roomAll",1)'></li>
                        <li class="name_li">序号</li>
                        <li class="phone_li">楼栋名</li>
                        <li class="workNum_li">房间号</li>
                        <li class="name_li">房间面积</li>
                        <li class="name_li">房间状态</li>
                        <!-- <li class="operation_li">操作</li> -->
                    </ul>
                    <div>
                        <ul class="dept_ul" v-for="(room,i) in roomPage.list" :key="room.room_id">
                            <li class="checkbox_li"><input class="size_20" type="checkbox" :value="room.room_id" @click="checkBoxClick($event.target,room.room_id,1)"></li>
                            <li class="name_li">{{i+1}}</li>
                            <li class="phone_li">{{room.building_name}}</li>
                            <li class="workNum_li">{{room.room_code}}</li>
                            <li class="name_li">{{room.built_up_area}}</li>
                          
                                <li class="name_li" v-if="room.room_status == 1">自住</li>
                                <li class="name_li" v-else-if="room.room_status == 2">出租</li>
                                <li class="name_li" v-else-if="room.room_status == 3">未居住</li>
                                <li class="name_li" v-else-if="room.room_status == 4">未出售</li>
                                <li class="name_li" v-else-if="room.room_status == 5">公共空间</li>
                            
                            <!-- <li class="operation_li">
                                <a href="#">编辑</a>
                                <a href="#">删除</a>
                            </li> -->
                        </ul>
                    </div>
                    
                    
                    <div class="page_info">
                        <ul>
                            <!--首页传递1个参数 1控制请求1用户2楼栋3房间-->
                            <li class="widt-50" @click="startPage(3)">首页</li>
                            <!--上一页1个参数  1控制请求1用户2楼栋3房间-->
                            <li @click="prevPage(3)">&lt;</li>
                            
                            <li @click="roomListQuery(roomControlPageNum )">{{roomControlPageNum}}</li>
                            <!--下一页 1控制请求1用户2楼栋3房间4欠费-->
                            <li @click="nextPage(3)">&gt;</li>
                            <!--尾页传递3个参数 1总页数，2每页多少行，,3控制请求1用户2楼栋3房间-->
                            <li class="widt-50" @click="endPage(roomPage.total,roomPage.pageSize,3)">尾页</li>
                        </ul>
                    </div>
                </div>
            </div>
            <!--用户新增-->
            <div class="deptAdd_div" v-show="deptAdd">
                <h3>业主新增</h3>
                <div class="deptInfo_div">
                    <form action="javascript:void(0)">

                        <div class="basicInfo_div">
                            <div>用户名<span>*</span><input type="text" v-model="username"></div>
                            <div>年龄<span>*</span><input type="number" v-model="age"></div>
                            <div>性别<span>*</span>
                                <label class="mar-l-20" for="manInp">
                                    <input type="radio" v-model="gender" class="sexradio " id="manInp" name="sex"
                                        value="1">男
                                </label>
                                <label for="womanInp">
                                    <input type="radio" v-model="gender" class="sexradio " id="womanInp" name="sex"
                                        value="0">女
                                </label>
                            </div>
                            <div>身份证号<span>*</span><input type="text" v-model="idcard"></div>
                            <div class="flex1">房间号<span>*</span>

                                <select v-model="building" @click="fillBuildings">
                                    <option disabled value="">请选择楼栋号</option>
                                    <option v-for="b in buildings" :value="b.building_id">
                                        {{b.building_name}}
                                    </option>
                                </select>
                                <select v-model="floor" @click="fillFloors">
                                    <option disabled value="">请选择楼层号</option>
                                    <option v-for="f in floors" :value="f.floor_id">
                                        {{f.floor_number}}
                                    </option>
                                </select>
                                <select v-model="room" @click="fillRooms">
                                    <option disabled value="">请选择房间号</option>
                                    <option v-for="r in rooms" :value="r.room_id">
                                        {{r.room_code}}
                                    </option>
                                </select>
                                </divstyle>

                            </div>

                            <div class="operationBtn_div">
                                <button @click="addUser">保存</button>
                                <button @click.prevent="close(1)">取消</button>
                            </div>
                    </form>

                </div>
            </div>
        </div>
            <!--用户详细信息-->
            <div class="adminAdd_div" v-show="details">
                <h3>用户详细信息</h3>
                <div class="deptInfo_div">
                    <form>
                        <p>用户信息</p>
                        <div class="basicInfo_div userDetail_div">
                            <div>用户名:<span>{{userDetail.username}}</span></div>
                            <div>账号:<span>{{userDetail.account}}</span></div>
                            <div>性别:
                                <span v-if="userDetail.gender == 1">男</span>
                                <span v-if="userDetail.gender == 2">女</span>
                            </div>
                            <div>年龄:<span ></span>{{userDetail.age}}</div>
                            <div>身份证号:<span >{{userDetail.idcard}}</span></div>
                            <div>用户类型:
                                <span v-if="userDetail.user_type == 1" >管理员</span>
                                <span v-if="userDetail.user_type == 2" >物业</span>
                                <span v-if="userDetail.user_type == 3" >业主</span>
                            </div>
                            <div>用户状态:
                                <span  v-if="userDetail.user_status == 11" >管理员使用</span>
                                <span  v-if="userDetail.user_status == 21" >物业人员使用</span>
                                <span  v-if="userDetail.user_status == 31" >常住业主</span>
                                <span  v-if="userDetail.user_status == 32" >租户</span>
                                <span style="color: red !important;" v-if="userDetail.user_status == 33" >未激活</span>
                            </div>
                            <!-- <div>密码<span>*</span><input type="password"></div> -->
                            <!-- <div>手机<input type="text"></div>
                            <div>状态</div> -->
                        </div>
                        
                        <div class="operationBtn_div">
                            <!-- <button>保存</button> -->
                            <button @click.prevent="close(2)">取消</button>
                        </div>
                    </form>

                </div>
            </div>

            
        </div>
        <!--修改用户状态-->
        <div class="changeUserStatusPop" v-show="changeUserStatusPop">
            <div>用户状态修改</div>
            <div>
                <label for="propertyInp">
                    <input type="radio" name="status" v-model="newStatus" id="propertyInp" value="31" >常住业主
                </label>
                <label for="lesseeInp">
                    <input type="radio" name="status" v-model="newStatus" id="lesseeInp" value="32" >租户
                </label>
                <label for="statusInp">
                    <input type="radio" name="status" v-model="newStatus" id="statusInp" value="33" >未激活
                </label>
            </div>
            <div>
                <button @click.prevent="changeUserStatus" class="status-confirm-btn">确定</button>
                <button @click.prevent="close(3)" class="status-cancel-btn">取消</button>
            </div>
        </div>
        <!--批量修改房间状态-->
        <div class="changeUserStatusPop" v-show="bacthchangeRoomStatusPop">
            <div>批量修改房间状态</div>
            <div>
                <label for="selfInp">
                    <input type="radio" name="roomStatus" v-model="roomStatus" id="selfInp" value="1" >自住
                </label>
                <label for="rentInp">
                    <input type="radio" name="roomStatus" v-model="roomStatus" id="rentInp" value="2" >出租
                </label>
                <label for="unliveInp">
                    <input type="radio" name="roomStatus" v-model="roomStatus" id="unliveInp" value="3" >未居住
                </label>
                <label for="unsellInp">
                    <input type="radio" name="roomStatus" v-model="roomStatus" id="unsellInp" value="4" >未售出
                </label>
                <label for="publicInp">
                    <input type="radio" name="roomStatus" v-model="roomStatus" id="publicInp" value="5" >公共空间
                </label>
            </div>
            <div>
                <button @click.prevent="batchChangeRoomStatus" class="status-confirm-btn">确定</button>
                <button @click.prevent="close(4)" class="status-cancel-btn">取消</button>
            </div>
        </div>
        <!--费率修改-->
        <div class="changeUserStatusPop feeDiv " v-show="updateChangePop">
            <div>费率修改</div>
            <div class="feeInputDiv">
                费用名称：<input type="text" v-model="feeName"><br>
                费用单价：<input type="text" v-model="feePrice"  placeholder="两位小数，如：2.00"><br>
                费用介绍：<textarea name="" id="" v-model="feeIntro" cols="22" rows="5"></textarea><br>
            </div>
            <div>
                <button @click.prevent="changeFee" class="status-confirm-btn">确定</button>
                <button @click.prevent="updateChangePop = false" class="status-cancel-btn">取消</button>
            </div>
        </div>
        <!--新增单个建筑-->
        <div class="changeUserStatusPop  buildingSingleInsert" v-show="insertSinglePop">
            <div>新增单个建筑</div>
            <div class="feeInputDiv">
                建筑编码：<input type="text" v-model="buildingCode"><br>
                建筑名：&nbsp;&nbsp;&nbsp;<input type="text" v-model="buildingName"><br>
                楼层数：&nbsp;&nbsp;&nbsp;<input type="number" v-model="buildingFloors"><br>
                建筑状态：<input class="radioInp"  type="radio" v-model="buildingStatus" value="1">使用
                         <input  class="radioInp" type="radio" v-model="buildingStatus" value="2">未使用<br>
                建成时间：<input type="date" v-model="completedDate"><br>
                设计年限：<input type="number" v-model="desginLife"><br>
                产权年限：<input type="number" v-model="ownership"><br>
            </div>
            <div>
                <button @click.prevent="buildinginsert" class="status-confirm-btn">确定</button>
                <button @click.prevent="insertSinglePop = false" class="status-cancel-btn">取消</button>
            </div>

        </div>
        <!--批量添加建筑-->
        <div class="changeUserStatusPop  addbuilds" v-show="addBuildingsPop">
            <div>批量添加建筑</div>
            <div class="feeInputDiv">
                建筑编码：<input type="text" v-model="buildingCode"><br>
                建筑名：&nbsp;&nbsp;&nbsp;<input type="text" v-model="buildingName"><br>
                楼层数：&nbsp;&nbsp;&nbsp;<input type="number" v-model="buildingFloors"><br>
                建筑状态：<input class="radioInp"  type="radio" v-model="buildingStatus" value="1">使用
                         <input  class="radioInp" type="radio" v-model="buildingStatus" value="2">未使用<br>
                建成时间：<input type="date" v-model="completedDate"><br>
                设计年限：<input type="number" v-model="desginLife"><br>
                产权年限：<input type="number" v-model="ownership"><br>
                楼栋个数：<input type="number" v-model="buildingSize"><br>
                房间面积：<input type="text" v-model="buildingArea " placeholder='用","分隔房间面积'><br>
            </div>
            <div>
                <button @click.prevent="addbuildings" class="status-confirm-btn">确定</button>
                <button @click.prevent="addBuildingsPop = false" class="status-cancel-btn">取消</button>
            </div>
            
        </div>
        <!--批量修改楼栋状态-->
        <div class="changeUserStatusPop" v-show="bacthchangeBuildingStatusPop">
            <div>批量修改楼栋状态</div>
            <div>
                <label for="useInp">
                    <input type="radio"  v-model="batchBuildingStatus" id="usefInp" value="1" >使用
                </label>
                <label for="unuseInp">
                    <input type="radio"  v-model="batchBuildingStatus" id="unuseInp" value="2" >未使用
                </label>
                
            </div>
            <div>
                <button @click.prevent="batchChangeBuildingStatus" class="status-confirm-btn">确定</button>
                <button @click.prevent="close(5)" class="status-cancel-btn">取消</button>
            </div>
        </div>
    </div>

    
</body>

</html>
